<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
	
<!DOCTYPE HTML>
<html>

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>Login</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta name="author" content="" />

<meta name="twitter:title" content="" />
<meta name="twitter:image" content="" />
<meta name="twitter:url" content="" />
<meta name="twitter:card" content="" />

<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,700"
	rel="stylesheet">

<!-- Animate.css -->
<link rel="stylesheet" href="css/other/animate.css">
<!-- Icomoon Icon Fonts-->
<link rel="stylesheet" href="css/other/icomoon.css">
<!-- Themify Icons-->
<link rel="stylesheet" href="css/other/themify-icons.css">
<!-- Bootstrap  -->
<link rel="stylesheet" href="css/other/bootstrap.css">
<link rel="stylesheet" href="css/other/bootstrap-select.min.css" />
<!-- Magnific Popup -->
<link rel="stylesheet" href="css/other/magnific-popup.css">

<!-- Owl Carousel  -->
<link rel="stylesheet" href="css/other/owl.carousel.min.css">
<link rel="stylesheet" href="css/other/owl.theme.default.min.css">

<!-- Theme style  -->
<link rel="stylesheet" href="css/other/style.css">

<!-- Modernizr JS -->
<script src="js/other/modernizr-2.6.2.min.js"></script>
<!-- FOR IE9 below -->
<!--[if lt IE 9]>
	<script src="js/other/respond.min.js"></script>
	<![endif]-->
<!-- jQuery -->
<script src="js/other/jquery.min.js"></script>
<!-- jQuery Easing -->
<script src="js/other/jquery.easing.1.3.js"></script>
<!-- Bootstrap -->
<script src="js/other/bootstrap.min.js"></script>
<script type="text/javascript" src="js/other/bootstrap-select.min.js"></script>
<!-- Waypoints -->
<script src="js/other/jquery.waypoints.min.js"></script>
<!-- Carousel -->
<script src="js/other/owl.carousel.min.js"></script>
<!-- countTo -->
<script src="js/other/jquery.countTo.js"></script>
<!-- Magnific Popup -->
<script src="js/other/jquery.magnific-popup.min.js"></script>
<script src="js/other/magnific-popup-options.js"></script>
<!-- Main -->
<script src="js/other/main.js"></script>

</head>

<body>

	<div class="gtco-loader"></div>

	<div id="page">
		<div class="page-inner">
			<nav class="gtco-nav" role="navigation">
				<div class="gtco-container">

					<div class="row">
						<div class="col-sm-4 col-xs-12">
							<div id="gtco-logo">
								<a href="Login.jsp">Home <em>.</em></a>
							</div>
						</div>
					</div>

				</div>
			</nav>
		</div>

		<header id="gtco-header" class="gtco-cover" role="banner"
			style="background-image: url(images/a4.jpg)">
			<div class="overlay"></div>
			<div class="gtco-container">
				<div class="row">
					<div class="col-md-12 col-md-offset-0 text-left">
						<div class="row row-mt-12em">
							<div class="col-md-6 col-md-push-3 animate-box"
								style="margin-top: 6.5em;" data-animate-effect="fadeInRight">
								<div class="form-wrap"
									style="opacity: 0.7; text-align: center; letter-spacing: 5px; line-height: 190%;">
									<div class="tab">
										<ul class="tab-menu">
											<li style="width: 100%;">
												<div data-tab="login"
													style="line-height: 200%; height: 55px; font-weight: 900; font-size: 25px; font-family: 'Comic Sans MS'; color: #ffefef; background-color: #aca7a5; border-radius: 5px 5px 0 0; box-shadow: #AFD9EE 0px 0px 5px 5px">用户登入</div>
											</li>
										</ul>
										<div class="tab-content" style="font-size: 20px;">
											<div class="tab-content-inner active" data-content="login">
												<form id="userinfo" action="LoginServlet" method="post">
													<div class="row form-group">
														<div class="col-md-12">
															<label for="studentno">账号</label> <input type="text"
																class="form-control" id="username" name="username"
																pattern="[0-9]{6,}" required oninvalid="setCustomValidity('请输入长度超过六位数字的账号')"
																oninput="setCustomValidity('')">

														</div>
													</div>
													<div class="row form-group">
														<div class="col-md-12">
															<label for="class">密码</label> <input type="password"
																class="form-control" id="password" name="password"
																required oninvalid="setCustomValidity('请输入密码')"
																oninput="setCustomValidity('')">
														</div>
													</div>
													<div class="row form-group">
														<div class="col-md-12">
															<input type="submit" class="btn btn-success" value="登入">
															<input type="button" class="btn btn-primary" value="注册" onclick="window.location.href='Register.jsp '">
														</div>
													</div>
												</form>
												
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</header>
	</div>

</body>

</html>